/** @type {import('tailwindcss').Config} */
module.exports = {
    content: ["./index.html", "./src/**/*.{vue,js,ts,jsx,tsx}"],
    theme: {
        colors: {
            white: "var(--color-white)",
            primary: {
                DEFAULT: "var(--el-color-primary)",
                "light-3": "var(--el-color-primary-light-3)",
                "light-5": "var(--el-color-primary-light-5)",
                "light-7": "var(--el-color-primary-light-7)",
                "light-8": "var(--el-color-primary-light-8)",
                "light-9": "var(--el-color-primary-light-9)",
                "dark-2": "var(--el-color-primary-dark-2)"
            },
            success: "var(--el-color-success)",
            warning: "var(--el-color-warning)",
            danger: "var(--el-color-danger)",
            error: "var(--el-color-error)",
            info: "var(--el-color-info)",
            body: "var(--el-bg-color)",
            page: "var(--el-bg-color-page)",
            "tx-primary": "var(--el-text-color-primary)",
            "tx-regular": "var(--el-text-color-regular)",
            "tx-secondary": "var(--el-text-color-secondary)",
            "tx-placeholder": "var(--el-text-color-placeholder)",
            "tx-disabled": "var(--el-text-color-disabled)",
            br: "var(--el-border-color)",
            "br-light": "var(--el-border-color-light)",
            "br-extra-light": "var(--el-border-color-extra-light)",
            "br-dark": "var( --el-border-color-dark)",
            fill: "var(--el-fill-color)",
            "fill-light": "var(--el-fill-color-light)",
            "fill-lighter": "var(--el-fill-color-lighter)",
            mask: "var(--el-mask-color)"
        },
        fontFamily: {
            sans: ["PingFang SC", "Arial", "Hiragino Sans GB", "Microsoft YaHei", "sans-serif"]
        },
        boxShadow: {
            DEFAULT: "var(--el-box-shadow)",
            light: "var(--el-box-shadow-light)",
            lighter: "var(--el-box-shadow-lighter)",
            dark: "var(--el-box-shadow-dark)"
        },
        fontSize: {
            xs: "var(--el-font-size-extra-small)",
            sm: "var( --el-font-size-small)",
            base: "var( --el-font-size-base)",
            lg: "var( --el-font-size-medium)",
            xl: "var( --el-font-size-large)",
            "2xl": "var( --el-font-size-extra-large)",
            "3xl": "20px",
            "4xl": "24px",
            "5xl": "28px",
            "6xl": "30px",
            "7xl": "36px",
            "8xl": "48px",
            "9xl": "60px"
        },
        spacing: {
            px: "1px",
            0: "0px",
            0.5: "2px",
            1: "4px",
            1.5: "6px",
            2: "8px",
            2.5: "10px",
            3: "12px",
            3.5: "14px",
            4: "16px",
            5: "20px",
            6: "24px",
            7: "28px",
            8: "32px",
            9: "36px",
            10: "40px",
            11: "44px",
            12: "48px",
            14: "56px",
            16: "64px",
            20: "80px",
            24: "96px",
            28: "112px",
            32: "128px",
            36: "144px",
            40: "160px",
            44: "176px",
            48: "192px",
            52: "208px",
            56: "224px",
            60: "240px",
            64: "256px",
            72: "288px",
            80: "320px",
            96: "384px"
        },
        lineHeight: {
            none: "1",
            tight: "1.25",
            snug: "1.375",
            normal: "1.5",
            relaxed: "1.625",
            loose: "2",
            3: "12px",
            4: "16px",
            5: "20px",
            6: "24px",
            7: "28px",
            8: "32px",
            9: "36px",
            10: "40px"
        }
    },

    plugins: [
        require("@tailwindcss/line-clamp") // 引入插件
    ]
}
